<template>
	<view class="content">
		<view class="text" @tap="toSignUp">注册</view>
		<view class="logo"><image src="../../static/images/sign/logo1.png"></image></view>
		<view class="main">
			<view class="title">登录</view>
			<view class="slogan">您好，欢迎来到 yike！</view>
			<view class="inputs">
				<input type="text" placeholder="邮箱" class="user" placeholder-style="color:#aaa;font-weight:400;" @blur="getEmail" />
				<input type="password" placeholder="密码" class="psw" placeholder-style="color:#aaa;font-weight:400;" @blur="getPwd" />
			</view>
			<view class="tips" v-if="isError">邮箱或密码错误</view>
		</view>
		<view class="submit" @tap="login">登录</view>
	</view>
</template>

<script>
import request from '../../api/request.js';
export default {
	data() {
		return {
			email: '',
			pwd: '',
			isError: false
		};
	},
	methods: {
		//跳转到注册页面
		toSignUp() {
			uni.navigateTo({
				url: '../signup/signup'
			});
		},
		//获取用户名/邮箱
		getEmail(e) {
			this.email = e.detail.value;
		},
		//获取密码
		getPwd(e) {
			this.pwd = e.detail.value;
		},

		//登录提交
		async login() {
			if (this.email && this.pwd) {
				let res = await request({
					url: '/login',
					data: {
						email: this.email,
						pwd: this.pwd
					},
					method: 'POST'
				});
				console.log(res)
				res = res[1].data;
				if (res.status) {
					uni.showToast({
						title: res.msg,
						duration: 2000
					});
					uni.setStorageSync("token",res.token)
					uni.setStorageSync("tokenTime",new Date())
					this.$store.dispatch("getNotice")
					this.$store.dispatch("getFriends")
					this.$store.dispatch("getAcquire")
					this.$store.dispatch("getUserInfo")
					this.$store.dispatch("getDyNotify")
					this.$store.dispatch("getComNotify")
					this.$store.dispatch("acquireVisitors")
					this.$store.dispatch('getDialogue');
					setTimeout(()=>{
						uni.switchTab({
						    url: '/pages/index/index'
						});
					},2100)
				} else {
					uni.showToast({
						title: res.msg,
						icon: 'none',
						duration: 2000
					});
				}
			}
		}
	}
};
</script>

<style lang="scss">
@import '../../commons/css/mycss.scss';
.text {
	position: fixed;
	z-index: 1001;
	right: 20rpx;
	top: var(--status-bar-height);
}
.logo {
	text-align: center;
	image {
		padding-top: 256rpx;
		width: 194rpx;
		height: 92rpx;
		margin: 0 auto;
	}
}
.main {
	padding: 54rpx $uni-spacing-row-lg 120rpx;
	//width: 100%;
	.title {
		font-size: 56rpx;
		font-weight: 500;
		color: $uni-text-color;
		line-height: 80rpx;
	}
	.slogan {
		font-size: 40rpx;
		color: $uni-text-color-grey;
		line-height: 56rpx;
	}
	.inputs {
		padding-top: 8rpx;

		input {
			padding-top: 40rpx;
			height: 88rpx;
			font-size: $uni-font-size-lg;
			font-weight: 500;
			color: $uni-text-color;
			line-height: 88rpx;
			border-bottom: 1px solid $uni-border-color;
		}
	}
	.tips {
		float: left;
		font-size: $uni-font-size-lg;
		color: $uni-color-warning;
		line-height: 56rpx;
	}
}
.submit {
	margin: 0 auto;
	width: 520rpx;
	height: 96rpx;
	background: $uni-color-primary;
	box-shadow: 0px 50rpx 32rpx -36rpx rgba(255, 228, 49, 0.4);
	border-radius: 48rpx;
	font-size: $uni-font-size-lg;
	font-weight: 500;
	color: $uni-text-color;
	line-height: 96rpx;
	text-align: center;
}
</style>
